We’re all trying to do our bit to stave off climate change, from cycling to work to eating less meat. As founders, marketeers, designers, developers and other assorted creatives, we have a part to play as well. Every time you – or anyone else – opens a webpage, it uses electricity. That electricity adds more carbon into the atmosphere. So what can we do about it?
I’ve made it my mission to do business in a caring, ethical way, so I always want the websites I design to be low-carbon. That’s meant a fair bit of research, but it’s all completely worth it to get each website down to 0.5g of carbon or less. The best bit is that once you know what to do, it’s all easy to implement. Here’s how you can design a low-carbon website for your business.
Lower your file sizes
When thinking about lowering the carbon burned by your site, it’s useful to think about the amount of data that needs to be loaded every time a page is accessed. The more data there is, the more power will be needed to load it, and the more carbon will be released. An easy fix, then, is to reduce the size of the files on your webpage so there’s less to load.
Images are the biggest culprits for this. We don’t want our websites to be completely barren, but using fewer images is a good way to reduce the amount of data. The ones you do use should be compressed if possible. Our standard is to upload images at 72 dpi, using RBG and as a Webp file. This is a good, efficient option.
You can also apply a “lazy load”. A normal webpage loads everything at once, but what if your user only scrolls halfway down the page? That essentially means half the power used to load it was wasted. A lazy load doesn’t start to load images until the user gets to them, so their file sizes don’t count towards the page’s data if they aren’t being seen.
Be smart with colours
When it comes to webpages, colour equals power. Again, I’m not suggesting we should all stick to a strict black and white; that’s no way to stand out on the internet! However, sensible choices go a long way when it comes to saving power. Reducing the sheer number of colours your webpages need to load will go a long way towards reducing carbon.
We’ve designed sites with images that remain black and white until a mouse pointer hovers over them, at which point they transition into colour. Not only is this a nice effect, but it also means many of the images can stay in greyscale if they never get hovered over, once again reducing data.
What about animations?
Animations aren’t an essential part of web design, but they are good to have and help a site stand out. There are still plenty of steps that can be taken to keep their power consumption as low as possible. For example, SVG files have a lower file size and are therefore a good option for a low-carbon site.
You can also set your animations and videos to only play once, rather than looping. These are all small changes, but they really add up and help your website reduce its carbon footprint.
Is this useful? Keep an eye on our blog for more helpful sustainability guides.
